body {
    font-family: 'Circular-Book', "PingFang SC", Verdana, Arial, '微软雅黑', 'Microsoft YaHei';
    color: var(--mk-text-color-primary);
    text-align: center;
    font-size: 14px;
}



.mt16{
    margin-top: 16px;
}
.op1{
    opacity: 1!important;
}
.vpn-container {
    padding: 0 !important;
    overflow: hidden;
    background: url(@/assets/img/bg.png) 50%;
    background-size: cover;

    .content {
        position: relative;
        height: 100vh;

        .adv-slogans {
            position: absolute;
            width: 100%;
            top: 6%;
            text-align: center;

            .title {
                color: #fff;
                font-size: 50px;
                font-weight: 600;
                line-height: 70px;
                text-shadow: 0 2px 15px rgba(0, 0, 0, 0.3);
            }
        }

        .anim-phone {
            position: absolute;
            width: 100%;
            height: 510px;
            background: url(@/assets/img/home-anim-phone.svg) center no-repeat;
            bottom: -60px;
            z-index: 9;
        }

        .move-box {
            position: absolute;
            bottom: 30px;
            left: 50%;
            width: var(--mk-box-width);
            height: var(--mk-box-width);
            margin-left: -300px;

        }

        .info {
            position: absolute;
            bottom: 30px;
            left: 50%;
            display: flex;
            justify-content: center;
            align-items: center;
            flex-direction: column;
            z-index: 16;           
            width: 230px;
            margin-left: -115px;
        }

        .tip-txt {
            line-height: 36px;
            font-size: 14px;
        }

        .mi-btn {
            display: block;             
            padding: 12px 45px;
            font-size: 19px;
            letter-spacing: 1px;
            font-weight: 400; 
            border-radius: 4px;
            text-align: center;
            color: var(--mk-primary-color);           
            font-size: 16px;
            text-decoration: none;
            border:1px solid var(--mk-primary-color);
        }
        .mi-btn-primary{
            color: #fff;
            background-color: var(--mk-primary-color);
           
        }
        .reg-link{
            margin-top:70px;
        }

        .move-block {
            display: flex;
            justify-content: center;
            align-items: flex-end;
            width: var(--mk-box-width);
            height: var(--mk-box-width);
            position: absolute;
            img{
                filter: blur(1.6px);
            }
            .move-icon {
                position: relative;
                margin-bottom: -34px;
                width: 76px;
                height: 76px
            }
        }
    }
}


@media screen and (max-width: 640px) {
  
    .vpn-container {
        .content {
            .adv-slogans {
                .title {
                    font-size: 36px;
                    line-height: 50px;
                }
            }
            .anim-phone{
                bottom: -100px;
                transform: scale3d(0.9, 0.9,0.9)!important;
            }
            .move-box {
                bottom: -20px;
                transform: scale3d(0.7,0.7,0.7);
            }
            .info{
                bottom: 20px;
                transform: scale3d(0.9, 0.9,0.9)!important;
            }
            .reg-link{
                margin-top:50px;
            }
        }
    }
 
}